<template>
    <section  style="height: 100%;background:#f5f5f5;">
      <header>
        <div style="font-size: .3rem">账户余额（元）</div>
        <div style="font-size: .72rem;margin-top: .16rem">{{balanceCount}}</div>
      </header>

      <div style="background: #fff;box-shadow: 0px -5px 10px rgba(194,194,194,.2);position: relative;">
        <yd-cell-item arrow type="link" href="/recharge">
          <img slot="icon" src="../../assets/mine/recharge.png" style="width: .39rem;height: .38rem;position: relative;top: .04rem;">
          <span slot="left" style="margin-left: .01rem;">优惠充值</span>
        </yd-cell-item>
        <yd-cell-item arrow type="link" href="/deal_detail">
          <img slot="icon" src="../../assets/mine/trade.png"  style="width: .36rem;height: .38rem;position: relative;top: .04rem;">
          <span slot="left" style="margin-left: .04rem;">交易明细</span>
        </yd-cell-item>
      </div>
    </section>
</template>

<script>

    export default {
        name: "balancePage",
        data(){
          return{
            balanceCount:'',
          }
        },
      created(){
        let that = this;
        this.$ajax.post(window.g.apiUrl+'/account/getBalance.do')
          .then((response)=>{
            if(response.data.code == 200){
              that.balanceCount = response.data.data;
            }else{
              that.$dialog.notify({
                mes: '余额获取超时，请稍后重试',
                timeout: 1500,
              });
            }
          }).catch(()=>{
        })
      }
    }
</script>

<style scoped>
  header{
    width: 100%;
    height: 3rem;
    background-image: url("../../assets/mine/balance_bg.jpg");
    background-size: 100% 100%;
    color: #fff;
    display: flex;
    flex-flow: column;
    justify-content: center;
    align-items: flex-start;
    padding-left: .24rem;
  }
</style>
